<div class="sm-rightPanel bg-darken">
    <blockquote class="site-text layui-elem-quote">
        编辑单图文
    </blockquote>
    <div class="layui-form" action="">
        <div class="layui-row">
            <div class="wxmp-doclist">
                <div class="content">
                    <div class="main">
                        <img src="/images/common/default.png" alt="">
                        <p>请输入标题</p>
                    </div>
                </div>
            </div>
            <div class="sm-form-lg" id="dialog_form" style="overflow: hidden;">
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" id="add_tltle" lay-verify="required" placeholder="请输入标题"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>作者</label>
                    <div class="layui-input-block">
                        <input type="text" name="author" id="add_auth" lay-verify="required" placeholder="请输入作者"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>封面图</label>
                    <div class="layui-input-block">
                        <input type="hidden" name="picpath" id="add_picpath" value="">
                        <input type="hidden" name="thumbMediaId" id="add_thumbMediaId" value="">
                        <div class="layui-upload-drag" id="uploader">
                            <i class="layui-icon"></i>
                            <p>点击上传，或将文件拖拽到此处</p>
                        </div>
                        <input type="checkbox" name="showpic" title="封面图片显示在正文中" lay-skin="primary" id="add_showpic"
                               value="1">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>摘要</label>
                    <div class="layui-input-block">
                        <input type="text" name="brief" id="add_digest" lay-verify="required" placeholder="请输入摘要"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">原文链接</label>
                    <div class="layui-input-block">
                        <input type="text" name="fromurl" id="add_fromurl" placeholder="请输入原文链接"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">留言</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="open_comment" value="1" checked="checked" lay-skin="switch"
                               lay-text="开启|关闭" lay-filter="comment" id="add_open_comment">
                        <div class="layui-inline" id="add_comment_type" style="margin-bottom:0;">
                            <input type="radio" name="fans_can_comment" value="0" title="所有人可留言" checked>
                            <input type="radio" name="fans_can_comment" value="1" title="仅粉丝可留言">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item" id="advert" style="display: none;">
                    <label class="layui-form-label">广告</label>
                    <div class="layui-input-block">
                        <input type="radio" name="advert" value="0" title="不显示" checked lay-filter="advert">
                        <input type="radio" name="advert" value="1" title="显示" lay-filter="advert">
                    </div>
                </div>+
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>内容</label>
                    <div class="layui-input-block">
                        <textarea name="content" id="content" cols="30" rows="10"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn" lay-submit lay-filter="addsingle_form">立即提交</button>
                        <button type="button" class="layui-btn" id="add_canl">取消</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['layedit', "upload", "form"], function () {
        var layedit = layui.layedit;
        var upload = layui.upload;
        var form = layui.form;
        var $ = layui.$;
        var TEMP_ADVERT = "";
        // 设置富文本上传接口
        layedit.set({
            uploadImage: {
                url: '/managerImg/uploadFile',
                type: 'post'
            },
            uploadVideo: {
                url: '/managerImg/uploadFile',
                type: 'post'
            },
            uploadAudio: {
                url: '/managerImg/uploadFile',
                type: 'post'
            },
        });

        var layeditIndex = layedit.build('content');
        var id = getHashParam().id;
        var mediaId = "";
        form.render();

        // 获取广告信息
        smartAui.ajax({
            url: '/advert/info',
            success: function (result) {
                if (result.success && result.data) {
                    $("#advert").show();
                    TEMP_ADVERT = result.data.content;
                }
                query(id);
            }
        });


        //取消
        $("#add_canl").click(function () {
//         	location.href = "/views/index.html#/material/document/document";
            jumpByHash("/wx/material/document/document[type=single]");
        });
        //开启关闭留言
        form.on('switch(comment)', function (data) {
            console.log(data.elem); //得到checkbox原始DOM对象
            console.log(data.elem.checked); //开关是否开启，true或者false
            console.log(data.value); //开关value值，也可以通过data.elem.value得到
            console.log(data.othis); //得到美化后的DOM对象
            if (data.elem.checked) {
                $("#add_comment_type").show();
            } else {
                $("#add_comment_type").hide();
            }
        });

        //同步标题
        $("#add_tltle").keyup(function () {
            var v = $(this).val();
            $(".wxmp-doclist .main p").html(v ? v : "请输入标题")
        });

        // 广告切换显示
        form.on('radio(advert)', function (data) {
            if (data.value == "0") {
                // 不显示广告
                var description = layedit.getContent(layeditIndex);
                var wrap = $("<div></div>").html(description);
                wrap.find("div.wx-advert").remove();
                $("#content").text(wrap.html());
                layeditIndex = layedit.build('content');
            } else {
                // 显示广告
                if (TEMP_ADVERT) {
                    var description = layedit.getContent(layeditIndex);
                    var wrap = $("<div></div>").html(description);
                    wrap.append('<div class="wx-advert">' + TEMP_ADVERT + '</div>');
                    $("#content").text(wrap.html());
                    layeditIndex = layedit.build('content');
                }
            }
        });

        //提交
        form.on('submit(addsingle_form)', function (d) {
            var formData = d.field;

            var data = {};
            data.id = id;
            data.multType = 1;//这里指定死
            data.mediaId = mediaId;
            data.title = formData.title;
            data.author = formData.author;

            data.thumbMediaId = formData.thumbMediaId;
            data.picpath = formData.picpath;
            data.showpic = formData.showpic ? 1 : 0;

            data.brief = formData.brief;
            data.fromurl = formData.fromurl;
            data.opencomment = formData.open_comment ? 1 : 0;
            data.fanscancomment = formData.fans_can_comment;
            data.description = layedit.getContent(layeditIndex);
            if (data.thumbMediaId == "") {
                layer.msg("请上传封面图");
                return false;
            }
            if (data.description == "") {
                layer.msg("请输入文章内容");
                return false;
            }
            $.ajax({
                url: '/msgnews/updateSingleNews',
                data: data,
                success: function (result) {
                    if (result.success) {
                        layer.msg("保存成功");
                        setTimeout(function () {
                            setTimeout(function () {
                                jumpByHash("/wx/material/document/document[type=single]");
                            }, 1000);
                        }, 1000);
                    }
                },
            });
            return false;
        });

        //上传
        upload.render({
            elem: '#uploader',
            url: '/mediaFile/addMateria',
            data: {type: 'thumb'},//缩略图
            size: 64,
            accept: "images",
            exts: 'JPG|jpg',
            done: function (result) {
                if (result.success == 1) {
                    $("#uploader").html("<img src='" + result.data.url + "' style='width: 150px;height: 150px;'/><p>点击重新上传，或将文件拖拽到此处</p>");
                    $("#add_picpath").val(result.data.url);
                    $("#add_thumbMediaId").val(result.data.imgMediaId);
                    $(".wxmp-doclist .main img").attr("src", result.data.url);
                } else {
                    layer.msg("上传接口异常");
                }
            }
        });
        //查询
        function query(da) {
            $.ajax({
                type: 'POST',
                url: "/msgnews/toUpdateSingleNews",
                data: {id: da},
// 	            dataType:"json",
                success: function (result) {
                    console.log("opencomment " + result.data.opencomment)
                    if (result.success) {
                        $(".wxmp-doclist .main p").html(result.data.title);
                        mediaId = result.data.mediaId;
                        $("#add_tltle").val(result.data.title);
                        $("#add_auth").val(result.data.author);
                        $("#add_digest").val(result.data.brief);
                        $("#add_fromurl").val(result.data.fromurl);
                        var content = result.data.description ? result.data.description : "";
                        $("#content").html(content);

                        // 是否已加入广告
                        var $advert_radio = $("#advert .layui-input-block").html("");
                        var html = "";
                        if (content.indexOf("wx-advert") > -1) {
                            html = '<input type="radio" name="advert" value="0" title="不显示"  lay-filter="advert">';
                            html += '<input type="radio" name="advert" value="1" title="显示" checked lay-filter="advert">';
                        } else {
                            html = '<input type="radio" name="advert" value="0" title="不显示" checked lay-filter="advert">';
                            html += '<input type="radio" name="advert" value="1" title="显示" lay-filter="advert">';
                        }
                        $advert_radio.html(html);

                        $("#uploader").html("<img src='" + result.data.picpath + "' style='width: 150px;height: 150px;'/><p>点击重新上传，或将文件拖拽到此处</p>");
                        $("#add_picpath").val(result.data.picpath);
                        $("#add_thumbMediaId").val(result.data.thumbMediaId);

                        if (result.data.showpic == 1) {
                            $("#add_showpic").attr("checked", "checked");
                        } else {
                            $("#add_showpic").removeAttr("checked");
                        }
                        $("#add_showpic").prop("checked", result.data.showpic == 1 ? true : false);

                        if (result.data.opencomment == 1) {
                            $("#add_open_comment").attr("checked", true);
                        } else {
                            $("#add_open_comment").removeAttr("checked");
                        }
                        $("#add_open_comment").prop("checked", result.data.opencomment == 1 ? true : false);
                        result.data.opencomment == 1 ? $("#add_comment_type").show() : $("#add_comment_type").hide();
                        $("input[name=fans_can_comment][value=" + result.data.fanscancomment + "]").prop("checked", true);
                        $(".wxmp-doclist .main img").attr("src", result.data.picpath);
                        layeditIndex = layedit.build('content');
                        form.render();
                    }
                }
            });
        }
    });
</script>